 //动画原理
 // 1.获得盒子当前位置
 // 2.让盒子在当前位置加上1个移动距离
 // 3.利用定时器不断重复这个操作
 // 4.加一个结束定时器的条件
 // 5.注意此元素需要添加定位， 才能使用element. style.left
 // 6.封装成动画函数，多次使用,obj目标对象,target目标位置
 // 7.缓动动画公式：（目标值-现在的位置）/10
 // 8.回调函数等待所有程序都执行完了，才去调用。写到定时器里面
 function animate(obj, target, callback) {
     //先把原先的定时器清楚，避免占用动画队列，只保留当前定时器
     clearInterval(obj.timer);
     // obj timer避免反复去内存中开辟空间
     obj.timer = setInterval(function () {
         //步长写道定时器里面,step是正值就往右走，是负值就往左走，取正整数
         var step = (target - obj.offsetLeft) / 10;
         step = step > 0 ? Math.ceil(step) : Math.floor(step);
         if (obj.offsetLeft == target) {
             clearInterval(obj.timer);
             //  if (callback) {
             //      callback();
             //  }
             callback && callback();
         }
         //把每次加1步长改成一个慢慢变小的值
         obj.style.left = obj.offsetLeft + step + 'px';
     }, 15);
 }